/* Copyright (c) 2011, the Dart project authors.  Please see the AUTHORS file */
/* for details. All rights reserved. Use of this source code is governed by a */
/* BSD-style license that can be found in the LICENSE file. */

.hbox,
.vbox  {
  display: -moz-box;
  display: -webkit-box;
  -moz-box-align: stretch;
  -webkit-box-align: stretch;
  overflow: hidden;
}

.vbox {
  -moz-box-orient: vertical;
  -webkit-box-orient: vertical;
}

.hbox {
  -moz-box-orient: horizontal;
  -webkit-box-orient: horizontal;
}

.flex {
  -moz-box-flex: 1;
  -webkit-box-flex: 1;
}

.center {
  -moz-box-pack: center;
  -webkit-box-pack: center;
}

.own {
  position: relative;
  background: #fff;
  width: 500px;
  height: 500px;
  margin: 2px;
}

.enemy {
  position: relative;
  background: #fff;
  width: 500px;
  height: 550px;
  margin: 2px;
}

.icons {
  background-image: url(icons.gif);
  background-repeat: no-repeat;
}

.water {
  position:relative;
  background-position: 0 0;
  width:50px;
  height:50px;
  z-index: 1;
}

.miss {
  position:absolute;
  background-position: -50px 0;
  width:50px;
  height:50px;
  z-index: 3;
}

.hit {
  position:absolute;
  background-position: -100px 0;
  width:50px;
  height:50px;
  z-index: 3;
}

.hit-onboat {
  position:absolute;
  background-position: -850px 0;
  width:50px;
  height:50px;
  z-index: 5;
}

.maybe-hit {
  position:absolute;
  background-position: -900px 0;
  width:50px;
  height:50px;
  z-index: 2;
}

.boat2 {
  position:absolute;
  background-position: -150px 0;
  width:100px;
  height:50px;
  z-index: 2;
}

.boat3 {
  position:absolute;
  background-position: -250px 0;
  width:150px;
  height:50px;
  z-index: 2;
}

.boat4 {
  position:absolute;
  background-position: -400px 0;
  width:200px;
  height:50px;
  z-index: 2;
}

.boat5 {
  position:absolute;
  background-position: -600px 0;
  width:250px;
  height:50px;
  z-index: 2;
}

.boat-left {
}

.boatdir-down {
  -webkit-transform-origin: 0% 0%;
  -moz-transform-origin: 0% 0%;
  -webkit-transform: translate(50px, 0px) rotate(90deg);
  -moz-transform: translate(50px, 0px) rotate(90deg);
}

.boatdir-up {
  -webkit-transform-origin: 0% 0%;
  -moz-transform-origin: 0% 0%;
  -webkit-transform: translate(0px, 50px) rotate(-90deg);
  -moz-transform: translate(0px, 50px) rotate(-90deg);
}

.boatdir-right {
  -webkit-transform-origin: 0% 0%;
  -moz-transform-origin: 0% 0%;
  -webkit-transform: translate(50px, 50px) rotate(180deg);
  -moz-transform: translate(50px, 50px) rotate(180deg);
}

.notready {
  position: absolute;
  font-family:Arial;
  text-align:center;
  padding:100px 0px 100px 0px;
  top:75px;
  left:75px;
  height:150px;
  width:350px;
  z-index:10;
  background-color:white;
}

.shooting-status {
  position:absolute;
  font-family:monospace;
  background-color: white;
  top:500px;
  right:10px;
  z-index:10;
}

